<template>
	<view class="content">
		<u-cell-group title="帐号绑定:">
			<u-cell icon="account-fill" title="用户名" :value="baseInfo.username"></u-cell>
			<u-cell icon="phone-fill" title="手机绑定" :value="baseInfo.cellphone"></u-cell>
		</u-cell-group>
		<!-- <u-cell-group title="密码:">
				<u-cell icon="lock-fill" title="登陆密码" value="修改" @click="modifypassword"></u-cell>
		</u-cell-group>
		<u-cell-group title="帐号:">
				<u-cell icon="minus-people-fill" title="注销帐号" value="" @click="logout_account"></u-cell>
		</u-cell-group> -->
		<view class="btn">
			<u-button @click="showModal=true" type="primary">退出登陆</u-button>
			<u-modal :show="showModal" content='确定要退出吗?' @confirm="confirmExit" @cancel="showModal=false" showCancelButton></u-modal>
		</view>
		<view style="text-align: center;color: #999;font-size: 26rpx;">V {{ version}}</view>
	</view>
</template>
<script>
import {useRouter} from '@/utils/utils.js'
export default {
	data() {
		return {
			baseInfo: {
			  username:'',
			  cellphone:'',
			},
			version:"",
			showModal: false,
		}
	},
	onReady() {
		const that = this
		uni.getSystemInfo({
			success: function (res) {
				console.log("res", res)
				that.version = res.appVersion
			}
		})
	},
	onShow() {
		this.baseInfo.username = getApp().globalData.username
		this.baseInfo.cellphone = getApp().globalData.cellphone
	},
	methods: {
		confirmExit() {
			uni.removeStorageSync('token')
			uni.removeStorageSync('username')
			this.showModal = false
			useRouter('/pages/public/login',{} ,'reLaunch')
		}
	}
}
</script>
<style lang="scss" scoped>
	.content{
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		height: 100vh;
		box-sizing: border-box;
		padding-bottom: 50rpx;
	}
   page{background:#f2f2f2}
	.btn{
		padding-top: 20rpx;
		width:90%;
		margin: 0 auto;
	}
	::v-deep .u-button--primary{
		background-color: #318bf5 !important;
		border: 1px solid #318bf5;
	}
	::v-deep .u-cell-group__title__text {
		font-weight: 600 !important;
	}
	@media (min-width: 768px) {
		::v-deep .u-button--primary{
			padding: 30rpx !important;
			font-size: 22rpx !important;
		}
		::v-deep .u-cell-group__title__text {
			font-size: 22rpx !important;
		}
		::v-deep .u-cell__value {
			font-size: 22rpx !important;
		}
		::v-deep .u-cell__title-text {
			font-size: 22rpx !important;
		}
		.btn{
			margin-top: 50rpx;
		}
		::v-deep .u-icon__icon{
			font-size: 24rpx !important;
		}
		::v-deep .u-cell__body {
			padding: 15px !important;
		}
	}
	// @media (max-width: 767px) {}
</style>
